Ext.onReady(function() {
	var toolbar = Ext.create('Ext.toolbar.Toolbar', {
		dock : 'top',
		items : [{
					text : '返回',
					xtype : 'button',
					listeners : {
						click : function() {
							location.href = "/sysMgr/user_mgr";
						}
					}
				}, '-', {
					text : '添加',
					xtype : 'button',
					listeners : {
						click : function() {
							var form = Ext.getCmp("user_form");
							if(!form.isValid()){
								var cmps = form.queryBy(function(cmp){
									if(!Ext.isEmpty(cmp.isValid)){
										return !cmp.isValid();
									}
									return false;
								});
								cmps[0].focus();
								return ;
							}
							var params = {
								Username : Ext.getCmp("Username").getValue(),
								Name : Ext.getCmp("Name").getValue(),
								Sex : Ext.getCmp("Sex").getValue(),
								DepartmentId : Ext.getCmp("Department").getValue(),
								PositionId : Ext.getCmp("Position").getValue(),
								EducationId : Ext.getCmp("Education").getValue(),
								FlightId : Ext.getCmp("Flight").getValue(),
//									RFID : Ext.getCmp("RFID").getValue(),
								DocumentNumber : Ext.getCmp("DocumentNumber").getValue(),
								TwoInchPhotos : Ext.getCmp("user_photo").src,
								ProvinceId: Ext.getCmp("Province").getValue(),
								CityId: Ext.getCmp("City").getValue(),									
								HomeAddress : Ext.getCmp("HomeAddress").getValue(),
								ToPartInTheWorkTime : Ext.getCmp("ToPartInTheWorkTime").getValue(),
								ContactNumber : Ext.getCmp("ContactNumber").getValue(),
								Birthday : Ext.getCmp("Birthday").getValue(),
								PoliticalStatusId : Ext.getCmp("PoliticalStatus").getValue()
							};
							
							var grid = Ext.getCmp("role_grid");
							var selectionModel = grid.getSelectionModel();
							var models = selectionModel.getSelection();
							if(models.length <= 0)
							{
								Ext.Msg.alert("错误", '请指定角色');
								return;
							}
							params['RoleId'] = [];
							for(var i=0; i<models.length;i++){
								params['RoleId'][i] = models[i].get("Id");
							}								
								
							Ext.Ajax.request({
								url : '/user/add',
								type : 'POST',
								params : params,
								callback : function(options, success,
										response) {
									if (success) {
										var result = Ext
												.decode(response.responseText);
										if (result.success) {
											location.href = "/sysMgr/user_mgr";
										} else {
											Ext.Msg.alert("错误", result.msg);
										}
									}
								}
							});
						}
					}
				}]
	});
	var required = '<span style="color:red;font-weight:bold" data-qtip="Required">*</span>';
	var sexStore = Ext.create('Ext.data.Store', {
				fields : ['display', 'value'],
				data : [{
							"display" : "男",
							"value" : "1"
						}, {
							"display" : "女",
							"value" : "2"
						}]
			});

	var sex = Ext.create('Ext.form.ComboBox', {
				fieldLabel : '性别',
				editable : false,
				id : 'Sex',
				store : sexStore,
				queryMode : 'local',
				displayField : 'display',
				valueField : 'value',
				listeners : {
					afterrender : function(combo) {
						var firstValue = combo.getStore().first().get("value");
						combo.setValue(firstValue);
					}
				}
			});

	var departmentStore = Ext.create('Ext.data.Store', {
				fields : [{
							name : 'Id',
							type : 'int'
						}, 'Name'],
				proxy : {
					type : 'ajax',
					url : '/department/all',
					reader : {
						type : 'json',
						root : 'data.rows'
					}
				},
				autoLoad : true
			});

	var department = Ext.create('Ext.form.ComboBox', {
				fieldLabel : '部门',
				editable : false,
				margin : '0 5',
				id : 'Department',
				store : departmentStore,
				queryMode : 'local',
				displayField : 'Name',
				valueField : 'Id',
				listeners : {
					afterRender : function(combo) {
						combo.setValue(1);
					}
				}
			});

	var positionStore = Ext.create('Ext.data.Store', {
				fields : [{
							name : 'Id',
							type : 'int'
						}, 'Name'],
				proxy : {
					type : 'ajax',
					url : '/position/all',
					reader : {
						type : 'json',
						root : 'data.rows'
					}
				},
				autoLoad : true
			});

	var position = Ext.create('Ext.form.ComboBox', {
				fieldLabel : '职位',
				id : 'Position',
				editable : false,
				store : positionStore,
				queryMode : 'local',
				displayField : 'Name',
				valueField : 'Id',
				listeners : {
					afterRender : function(combo) {
						combo.setValue(1);
					}
				}
			});

	var educationStore = Ext.create('Ext.data.Store', {
				fields : [{
							name : 'Id',
							type : 'int'
						}, 'Name'],
				proxy : {
					type : 'ajax',
					url : '/education/all',
					reader : {
						type : 'json',
						root : 'data.rows'
					}
				},
				autoLoad : true
			});

	var education = Ext.create('Ext.form.ComboBox', {
				fieldLabel : '学历',
				margin : '0 5',
				editable : false,
				id : 'Education',
				store : educationStore,
				queryMode : 'local',
				displayField : 'Name',
				valueField : 'Id',
				listeners : {
					afterRender : function(combo) {
						combo.setValue(1);
					}
				}
			});

	var flightStore = Ext.create('Ext.data.Store', {
				fields : ["Id", 'Name'],
				proxy : {
					type : 'ajax',
					url : '/flight/all',
					reader : {
						type : 'json',
						root : 'data.rows'
					}
				},
				autoLoad : true
			});

	var flight = Ext.create('Ext.form.ComboBox', {
				fieldLabel : '班组',
				id : 'Flight',
				editable : false,
				store : flightStore,
				queryMode : 'local',
				displayField : 'Name',
				valueField : 'Id',
				listeners : {
					afterRender : function(combo) {
						combo.setValue(1);
					}
				}
			});

	var PoliticalStatusStore = Ext.create('Ext.data.Store', {
				fields : [{
							name : 'Id',
							type : 'int'
						}, 'Name'],
				proxy : {
					type : 'ajax',
					url : '/political_status/all',
					reader : {
						type : 'json',
						root : 'data.rows'
					}
				},
				autoLoad : true
			});

	var PoliticalStatus = Ext.create('Ext.form.ComboBox', {
				fieldLabel : '政治面貌',
				margin : '0 5',
				id : 'PoliticalStatus',
				store : PoliticalStatusStore,
				queryMode : 'local',
				editable : false,
				displayField : 'Name',
				valueField : 'Id',
				listeners : {
					afterRender : function(combo) {
						combo.setValue(1);
					}
				}
			});
	var ProvinceStore = Ext.create('Ext.data.Store', {
				fields : [{
							name : 'Id',
							type : 'int'
						}, 'Name', {
							name : "Cities",
							type : "object"
						}],
				proxy : {
					type : 'ajax',
					url : '/province/all',
					reader : {
						type : 'json',
						root : 'data.rows'
					}
				},
				autoLoad : true
			});
	var CityStore = Ext.create('Ext.data.Store', {
				id : "cityStore",
				fields : [{
							name : 'Id',
							type : 'int'
						}, 'Name']
			});

	var City = Ext.create('Ext.form.ComboBox', {
				id : "City",
				margin : '0 5',
				editable : false,
				store : CityStore,
				queryMode : 'local',
				displayField : 'Name',
				valueField : 'Id'
			});

	var Province = Ext.create('Ext.form.ComboBox', {
		margin : '0 5',
		id: "Province",
		store : ProvinceStore,
		editable : false,
		queryMode : 'local',
		displayField : 'Name',
		valueField : 'Id',
		listeners : {
			afterRender : function(combo) {
				combo.setValue(1);
				Ext.Ajax.request({
							url : "/province/getAllCities/1",
							callback : function(options, success, response) {
								if (success) {
									var result = Ext
											.decode(response.responseText);
									if (result.success) {
										CityStore
												.loadData(result.data.rows.Cities);
										City
												.setValue(result.data.rows.Cities[0].Id)
									}
								}
							}
						})
			},
			change : function(self, value, options) {
				Ext.Ajax.request({
							url : "/province/getAllCities/" + value,
							callback : function(options, success, response) {
								if (success) {
									var result = Ext
											.decode(response.responseText);
									if (result.success) {
										CityStore
												.loadData(result.data.rows.Cities);
										City
												.setValue(result.data.rows.Cities[0].Id)
									}
								}
							}
						})
			}
		}
	});

	var leftPanel = {
		xtype : "container",
		items : [{
					xtype : 'container',
					margin : '5 5',
					layout : 'hbox',
					items : [{
								xtype : 'textfield',
								id : 'Username',
								height:24,
								name : 'Username',
								afterLabelTextTpl : required,
								fieldLabel : '用户名',
								labelWidth: 98,
								width:270,
								allowBlank : false
							}, {
								xtype : 'textfield',
								margin : '0 5',
								name : 'Name',
								id : 'Name',
								labelWidth: 98,
								afterLabelTextTpl : required,
								fieldLabel : '真实姓名',
								allowBlank : false
							}]
				}, {
					xtype : 'container',
					margin : '5 5',
					layout : 'hbox',
					items : [sex, department]
				}, {
					xtype : 'container',
					margin : '5 5',
					layout : 'hbox',
					items : [position, education]
				}, {
					xtype : 'container',
					margin : '5 5',
					layout : 'hbox',
					items : [flight, PoliticalStatus]
				}]
	};
	var store = Ext.create('Ext.data.Store', {
	    fields:['Id', 'Name', 'Desp', 'privileges'],
	    autoLoad:true,
	    proxy: {
	        type: 'ajax',
	        url: '/role/all',
	        reader: {
	            type: 'json',
	            root: 'data.rows'
	        }
	    }
	});
	var roleGrid = Ext.create('Ext.grid.Panel', {
		id: 'role_grid',
		selType : 'checkboxmodel',
		store:store,
		region : 'center',
		columns : [ {
			text : '序号',
			xtype : 'rownumberer',
			width : 40,
			sortable : false
		}, {
			text : '名称',
			flex : 1,
			dataIndex : 'Name'
		}]
	});
	
	var panel = Ext.create("Ext.form.Panel", {
		id : 'user_form',
		autoScroll : true,
		border : false,
		bodyBorder : false,
		dockedItems : [toolbar],
		items : [{
			xtype : "container",
			layout : "hbox",
			minWidth: 700,
			items : [leftPanel, {
				xtype : "form",
				border : false,
				id : "photo_form",
				items : [{
							xtype : 'image',
							id : "user_photo",
							height : 100,
							width : 120,
							src : "view/images/default_headpic.png"
						}, {
							xtype : 'filefield',
							name : "photo",
							buttonMargin : 0,
							margin : 0,
							buttonConfig : {
								width : 120
							},
							buttonOnly : true,
							buttonText : '选择照片...',
							listeners : {
								change : function(self, value, eOpts) {
									Ext.getCmp("photo_form").submit({
										url : '/user/upload_photo',
										waitMsg : '上传您的照片中，请稍候……',
										success : function(form, action) {
											if (action.result.success) {
												Ext
														.getCmp("user_photo")
														.setSrc(action.result.data)
											}
										}
									})
								}
							}
						}]
			}]
		}/*, {
			xtype : 'container',
			layout : 'hbox',
			margin : '5 5',
			items : [{
						xtype : 'textfield',
						width : 500,
						height:24,
						name : 'RFID',
						id : 'RFID',
						fieldLabel : 'RFID'
					}]
		}*/, {
			xtype : 'container',
			margin : '5 5',
			layout : 'hbox',
			items : [{
						xtype : 'textfield',
						width : 500,
						name : 'DocumentNumber',
						id : 'DocumentNumber',
						fieldLabel : '身份证',
						regex: /(^\d{15}$)|(^\d{17}([0-9]|X)$)/,
						regexText: '输入的身份证号长度不对，或者号码不符合规定！15位号码应全为数字，18位号码末位可以为数字或X。',
						listeners : {
							blur:function(self, The, eOpts){
								if(!self.isValid()){
									return;
								}
								var value = self.getValue();
								var birthday = value.substring(6, 10) + '-' +  value.substring(10, 12) + '-' +  value.substring(12, 14) ;
								Ext.getCmp('Birthday').setValue(birthday);
							}
						}
					}]
		}, {
			xtype : 'container',
			margin : '5 5',
			layout : 'hbox',
			items : [{
						xtype : 'label',
						margin : '5 0',
						width : 100,
						text : '籍贯:'
					}, Province, {
						xtype : 'label',
						margin : '5 0',
						text : '省/直辖市'
					}, City, {
						xtype : 'label',
						margin : '5 0',
						text : '市/县/区'
					}]
		}, {
			xtype : 'container',
			margin : '5 5',
			layout : 'hbox',
			items : [{
						xtype : 'textfield',
						width : 500,
						name : 'HomeAddress',
						id : 'HomeAddress',
						fieldLabel : '家庭住址'
					}]
		}, {
			xtype : 'container',
			margin : '5 5',
			layout : 'hbox',
			items : [{
						xtype : 'datefield',
						name : 'ToPartInTheWorkTime',
						id : 'ToPartInTheWorkTime',
						fieldLabel : '参加工作时间',
						format : 'Y-m-d'
					}, {
						xtype : 'datefield',
						name : 'Birthday',
						id : 'Birthday',
						margin: '0 5',
						fieldLabel : '出生日期',
						format : 'Y-m-d'
					}]
		}, {
			xtype : 'container',
			margin : '5 5',
			layout : 'hbox',
			items : [{
						xtype : 'textfield',
						width : 250,
						height: 25,
						name : 'ContactNumber',
						regex: /^[0-9]{11,11}$/,
						regexText: '不是有效的手机号码',
						id : 'ContactNumber',
						fieldLabel : '联系电话',
						afterLabelTextTpl : required,
						allowBlank : false
					}]
		},{
			xtype : 'container',
			items : [roleGrid]
		}]
	});
	Ext.create('Ext.Viewport', {
				layout : 'fit',
				style : 'background:none;background-color:white;',
				items : [panel]
			});
});